<template>
  <div>
    <h1>用户详情</h1>
    <el-card>
      <div class="item">用户名：{{userInfo.name}}</div>
      <div class="item">电话号：{{userInfo.phone}}</div>
      <div class="item">收货地址：{{userInfo.address || '无'}}</div>
    </el-card>
  </div>
</template>

<script>
export default {
  props: {
    id: {}
  },
  data() {
    return {
      userInfo: {}
    };
  },
  methods: {
    async fetch() {
      const res = await this.$http.get(`rest/users/${this.id}`);
      this.userInfo = res.data
    }
  },
  created() {
    this.fetch();
  }
};
</script>

<style>
.item {
    padding: 20px;
}
</style>